@import 'modules/reset';
@import 'modules/header';
main{
  .wrap{
    width: 1024px;
    margin: 0 auto;
    .mainPanel{
      width: 100%;
      height: 738px;
      .swiper-container {
        width: 1024px;
        height: 738px;
        .swiper-button-prev{
          color:rgb(248, 248, 248);
          background-color: rgb(221, 221, 221);
        }
        .swiper-button-next{
          @extend .swiper-button-prev;
        }
        img{
          width: 100%;
          height: 100%;
        }
    }  
     
    }
  
  }
  .fourPanels{
    width: 1024px;
    margin: 0 auto;
    // margin-bottom: 15px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    li{
      margin-bottom: 20px;
      box-sizing: border-box;
      margin: 20px 2% 0 0;
      width: 23.5%;
      // position: relative;
      // max-width: 245px;
      height: 150px;
      img{
        width: 100%;
        height: 100%;
      }
      &:nth-child(4){
        margin-right: 0;
      }
      &:nth-child(8){
        margin-right: 0;
      }
    }
    

    }
  .more{
    padding-top: 20px;
    width: 1024px;
    margin: 0 auto;
    a{
      float: right;
      font-size:14px;
      color:#666;
      margin-right: 20px;
      position: relative;
      &::after{
        content:'';
        display: block;
        width: 15px;
        height: 15px;
        position: absolute;
        right: -20px;
        top: 0;
        background: url(../images/you.png) no-repeat center right;
        background-size: 15px 15px;
      }
    }
  } 
  .more2{
    width: 1024px;  
    height: 21px;
    margin: 0 auto;
    margin-top: 70px;
    margin-bottom: 15px;
    display: flex;
    h2{
      width: 200px;
      font-size: 18px;
      color:#333;
      font-weight: bold;
    }
    .more{
      padding: 0;
    }
  }
  .more2_img{
    display: flex;
    width: 1024px;
    margin: 0 auto;
    margin-bottom: 20px;
    justify-content: space-between;;
    li{
      width: 327px;
      height: 236px;
      img{
        width: 100%;
        height: 100%;
      }
    }
  }
  .more_information{
    width: 1024px;
    height: 174px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    li{
      display: flex;
      flex-direction: column;
      span{
        margin-bottom: 5px;
        font-size:small;
        color:#999;
      }
      a{
        font-size:17px;
        margin: 10px 0;
      }
    }
  } 
}
aside{
  margin-top: 50px;
  width: 100%;
  background-color: #ebebeb;
  .content{
    width: 1024px;
    height: 25px;
    margin: 0 auto;
    padding: 15px 0;
    display: flex;
    justify-content: space-between;
    .contact{
      width: 80px;
      display: flex;
      img{
        width: 30px;
        height: 25px;
        padding-right: 8px;
      }
    }
    img{
      width: 140px;
      height: 25px;
    }
  }
}
@import './modules/footer'